<template>
    <view>
        <van-toast id="van-toast" />
        <view class="img">
            <van-image round width="8rem" height="8rem" :src="userImg"/>
        </view>
        <view class="hello"><text>你好，尊敬的会员{{userName}} </text></view>
        <view class="one">
            <view>邀请码使用说明：</view>
            <view>1.老用户使用专属邀请码分享给好友</view>
            <view>2.新用户进入小程序到"我的 > 老带新活动" 输入邀请码，即可享受福利</view>
        </view>
        <view class="big">
            <view>这是您的邀请码，快去邀请朋友注册吧！</view>
        </view>
        <view class="yao">
            <view class="code">{{inviteCode}}</view>
        </view>
        <view class="share" @click="onshare" open-type="share">立即分享</view>
        <van-popup :show="show" round position="bottom" custom-style="height: 20%" closeable @close="onClose">
            <view class="fenxiang share-btn" @click="shareWechat"  open-type="share">
                <button class="share-btn shareBtn" open-type="share">
                   <img class="img2" :src="wechat" alt="">
                   <view class="text">立即分享</view> 
                </button>
            </view>
            <view class="fenxiang"></view>
        </van-popup>
        
    </view>
</template>
<script>
import Toast from '../../wxcomponents/vant/dist/toast/toast';
export default {
    data(){
        return{
            userImg:'',
            userName:'',
            inviteCode:'',
            show: false,
            ss:false,
            wechat:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1593405049630&di=ee36a277ec61559444b1f4e2df0209a8&imgtype=0&src=http%3A%2F%2Fwww.vsmiit.com%2Fjiameng%2Fpublic%2Fpinpai%2F20191017%2F65b27c3a907a630d0c02e0f6f734ceb5241.jpg'
        }
    },
    onLoad(){
        this.userName = getApp().globalData.userInfo[0].nickName
        this.userImg = getApp().globalData.userInfo[0].avatarUrl
        this.inviteCode = getApp().globalData.userInfo[0].inviteCode
    },
    onShareAppMessage(res) {
      return {
        // title: this.inviteCode,
        title: '安信逸家',
        path: '/pages/Strat/Strat?inviteCode=' 
      }
    //   + getApp().globalData.userInfo[0].inviteCode
    },
    methods:{
        onshare(){
            this.show = true
        },
        onClose(){
            this.show = false
        },
        shareWechat(){
            this.show = false
            Toast('请稍等...');   
        }
    }
}
</script>
<style scoped>
.img{
    display: flex;
    justify-content: center;
}    
.hello{
    display: flex;
    justify-content: center;
    color: rgb(175, 174, 174);
    font-size: 14px;
}
.big{
    margin-top: 80rpx;
    color: rgb(128, 126, 126);
    padding: 10rpx;
    width: 80%;
    margin: 0 auto;
    margin-top: 20rpx;
} 
.yao{
    border: 3px solid rgb(191, 247, 225);
    width: 80%;
    height: 100rpx;
    margin: 0 auto;
    margin-top: 20rpx;
}
.share{
    border: 1px solid rgb(186, 238, 217);
    width: 80%;
    height: 70rpx;
    margin: 0 auto;
    margin-top: 5rpx;
    text-align: center;
    line-height: 70rpx;
    font-size: 14px;
    color: rgb(76, 148, 167);
    background-color: rgb(215, 230, 201);
}
.code{
    width: 100%;
    height: 100rpx;
    background-color:  rgb(157, 206, 186);
    text-align: center;
    line-height: 100rpx;
    color: rgb(87, 83, 83);
    font-size: 18px;
}
#name{
    font-weight: 600;
}
.one{
    width: 90%;
    margin: auto;
}
.fenxiang{
    width: 180rpx;
    height: 200rpx;
    margin-top: 30rpx;
    float: left;
    margin-left: 30rpx;
    text-align: center; 
}
.img2{
   width: 120rpx;
   height: 120rpx;
   margin-top: 10rpx;

}
.text{
    font-size: 10px;
    margin-top: -20rpx;
}
.shareBtn{
    outline: none;
    width: 175rpx;
    height: 195rpx;

}
</style>